<!-- 我的----医生主页-----------------------------------------------------------------  -->
<template>
	<view class="institution-container">
		<view class="header">
			<image class="institution-icon" :src="alldata.doctorId?.avatar">
			</image>
			<view class="info-wrap">
				<view class="name">
					{{alldata.doctorId.name}}
				</view>
				<!-- <navigator url="/homepackge/pages/organizations/organizations"> -->
				<view class="address">
					所属机构：{{alldata.organizationId.name}}

				</view>
				<!-- </navigator> -->

				<view class="teamname">
					<text>
						所属团队：{{alldata.teamId.name}}</text>
				</view>

				<view class="number">
					签约人数：<span style="color: #2984F8;">{{alldata.doctorId?.signNumber}}</span>
				</view>
			</view>
		</view>
		<!-- 插入三个卡片 -->
		<view class="card-list">
			<view class="card-box" style="background-color: #2984F8;">
				<image class="card-icon" src="/static/news.png"></image>
				<view class="card-text">发诊消息</view>
			</view>
			<view class="card-box" style="background-color: #FDDB78;">
				<image class="card-icon" src="/static/phone.png"></image>
				<view class="card-text">拨打电话</view>
			</view>
			<view class="card-box" style="background-color: #28d094;">
				<image class="card-icon" src="/static/service.png"></image>
				<view class="card-text">申请服务</view>
			</view>
		</view>



		<!-- 医生简介 -->
		<view class="section">
			<view class="section-title">医生简介</view>
			<view class="intro-content">
				<text>
					{{alldata.doctorId?.intro||'暂无'}}
				</text>
			</view>
		</view>

		<view class="section">
			<view class="section-title">擅长</view>
			<view class="intro-content">
				{{alldata.doctorId?.skill||'暂无'}}

			</view>
		</view>



	</view>
</template>

<script setup>
	import {
		onLoad
	} from '@dcloudio/uni-app';
	import {
		ref
	} from 'vue';
	import {
		useContractStore
	} from '../../../store/contract';
	//状态机
	const contractStore = useContractStore()
	const alldata = ref(({}))
	// 接收mine-teamhomepage的三个ID传过来
	// 注意是options不是Option
	onLoad((options) => {
		console.log('接收到的参数:', options)

		// 从状态机获取三个ID的数据
		if (contractStore.contractDetail) {
			alldata.value = {
				...contractStore.contractDetail,
				doctorId: contractStore.contractDetail.doctorId,
				organizationId: contractStore.contractDetail.organizationId,
				teamId: contractStore.contractDetail.teamId
			}
		}

		console.log('渲染数据:', alldata.value)
	})
</script>

<style scoped lang="scss">
	/* 整体容器 */
	.institution-container {
		padding: 30rpx;
		background-color: #fff;
	}

	.header {
		display: flex;
		margin-bottom: 30rpx;
	}

	.institution-icon {
		width: 240rpx;
		height: 240rpx;
		margin-right: 24rpx;
		border-radius: 16rpx;
		border: 2rpx solid #E6F2FF;
	}

	.info-wrap {
		flex: 1;
	}

	.name {
		font-size: 36rpx;
		line-height: 34rpx;
		color: #333;
		margin-bottom: 12rpx;
	}

	.position {
		font-size: 28rpx;
		line-height: 30rpx;
		color: #999;
		margin-bottom: 12rpx;
	}

	.address {
		display: flex;
		align-items: center;
		font-size: 20rpx;
		color: #999999;
		line-height: 40rpx;
		margin-bottom: 16rpx;
	}

	.teamname {
		display: flex;
		align-items: center;
		font-size: 20rpx;
		color: #999999;
		line-height: 40rpx;
		margin-bottom: 14rpx;

	}

	.number {
		font-size: 12px;
		color: #999999;
		line-height: 20px;
		margin-bottom: 4px;
	}



	.contact {
		display: flex;
		gap: 8px;
	}

	/* 医生简介 */
	.section {
		margin-bottom: 20px;
	}

	.section-title {
		font-size: 16px;
		font-weight: bold;
		color: #333;
		padding-left: 8px;
		margin-bottom: 10px;
	}


	.intro-content {
		font-size: 14px;
		color: #999;
		line-height: 1.6;
	}

	.card-list {
		display: flex;
		justify-content: space-between;
		padding: 0 10px;
		margin-bottom: 20px;
	}

	.card-box {
		width: 88px;
		height: 88px;
		border-radius: 8px;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.card-icon {
		width: 26px;
		height: 28px;
		margin-bottom: 8px;
	}

	.card-text {
		font-size: 12px;
		color: #fff;
	}
</style>